
<div class="wp-20 ad-ad-contracts-detail">
    <ol class="breadcrumb">
        <li>合约中心</li>
        <li><a class="tittle-color" ui-sref="adContracts">广告合约</a></li>
        <li>广告合约{{planEdit?formData.id?"修改":"新建":"详情"}}</li>
    </ol>
    <div class="clearfix mt-10" ng-show="formData.id">
        <label class="title" title="广告合约Id">
            <label>I</label>
            <span>{{formData.id}}</span>
        </label>
        <label class="title" title="广告主">
            <label>S</label>
            <span>{{title.advShortName}}</span>
        </label>

    </div>

    <form class="form-horizontal" name="mainForm" ng-class="{planShow: !planEdit}" novalidate>
        <section class="fg-section">
            <div class="form-group" style="overflow: hidden;">
                <label class="col-sm-2 control-label">广告主</label>

                <div class="col-sm-8">
                    <p class="form-control-static" ng-hide="planEdit">{{title.advShortName}}</p>

                    <div ng-show="planEdit">
                        <input type="text" name="shortName" class="form-control pull-left mw-300" ng-model="title.advShortName" required readonly>
                        <a class="btn btn-link pull-left" ng-click="modelOpen(modelshortNameParam)">选择</a>
                    </div>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-2 control-label">合约有效期</label>
                <p class="form-control-static col-sm-8" ng-hide="planEdit">

                    {{formData.scheduleStart}}
                    <span>&nbsp;~&nbsp;</span>
                    {{formData.scheduleEnd}}</p>

                <div ng-show="planEdit" class="col-sm-8">
                    <ul class="list-unstyled">
                        <li class="clearfix">
                            <p class="input-group ad-scheduling">
                                <input type="text" class="form-control" uib-datepicker-popup="yyyy-MM-dd" ng-model="formData.scheduleStart" show-weeks="false" is-open="openedStart" min-date="" max-date="" close-text="关闭" clear-text="清除" current-text="今天" placeholder="开始时间" readonly>
								<span class="input-group-btn">
									<button type="button" class="btn btn-default" ng-click="open('openedStart')">
										<i class="glyphicon glyphicon-calendar"></i>
									</button>
								</span>
                            </p>
                            <p class="pull-left form-control-static">&nbsp;~&nbsp;</p>
                            <p class="input-group ad-scheduling">
                                <input type="text" class="form-control" uib-datepicker-popup="yyyy-MM-dd" ng-model="formData.scheduleEnd" show-weeks="false" is-open="openedEnd" min-date="" max-date="" close-text="关闭" clear-text="清除" current-text="今天" placeholder="结束时间" readonly>
								<span class="input-group-btn">
									<button type="button" class="btn btn-default" ng-click="open('openedEnd')">
										<i class="glyphicon glyphicon-calendar"></i>
									</button>
								</span>
                            </p>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">合约类型</label>

                <div class="col-sm-8">
                    <p class="form-control-static" ng-hide="planEdit">{{initData.codeTable[formData.contractType]}}</p>
                    <p class="form-control-static" ng-show="!planEdit && formData.contractTypememo">{{formData.contractTypeMemo}}</p>

                    <div ng-show="planEdit">
                        <label class="radio-inline mw-300" ng-repeat="item in initData.initCode.contractType">
                            <input type="radio" name="contractType" value="{{item}}" ng-model="formData.contractType" class="magic-radio" id="{{initData.initCode.contractType[$index]}}">
                            <label for="{{initData.initCode.contractType[$index]}}"></label>
                            {{initData.codeTable[item]}}
                        </label>
                        <textarea class="form-control mw-300" rows="2" placeholder="请输入..." ng-model="formData.contractTypeMemo" maxlength="500"></textarea>
                    </div>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-2 control-label">合约金额</label>
                <div class="col-sm-8">
                    <p class="form-control-static" ng-hide="planEdit">{{formData.contractTotal}}</p>
                    <div ng-show="planEdit" >
                        <input type="text" class="form-control display-ib mw-100" ng-model="formData.contractTotal" ng-keyup="checkPrice()">（万元）
                    </div>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-2 control-label">支付方式</label>

                <div class="col-sm-8">
                    <p class="form-control-static" ng-hide="planEdit">{{initData.codeTable[formData.payType]}}</p>
                    <p class="form-control-static" ng-show="!planEdit&&formData.payTypeMemo">{{formData.payTypeMemo}}</p>

                    <div ng-show="planEdit">
                        <label class="radio-inline mw-300" ng-repeat="item in initData.initCode.payType">
                            <input type="radio" name="payType" value="{{item}}" ng-model="formData.payType" class="magic-radio" id="{{initData.initCode.payType[$index]}}">
                            <label for="{{initData.initCode.payType[$index]}}"></label>
                            {{initData.codeTable[item]}}
                        </label>
                        <textarea class="form-control mw-300" rows="2" placeholder="请输入..." ng-model="formData.payTypeMemo" maxlength="500"></textarea>
                    </div>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-2 control-label">合约备注</label>
                <div class="col-sm-8">
                    <p class="form-control-static" ng-hide="planEdit">{{formData.content}}</p>
                    <div ng-show="planEdit">
                        <br>
                        <textarea class="form-control mw-300" rows="6" placeholder="请输入..." ng-model="formData.content" maxlength="500"></textarea>
                    </div>
                </div>
            </div>
            <div class="form-group">

                <label class="col-sm-2 control-label">合约扫描</label>
                <div class="col-sm-8">
                    <div class="form-inline">
                        <div ng-show="planEdit" class="a-upload">
                            <input type="file"  nv-file-select ng-click="onclick()" uploader="uploaderImage" class="form-control mw-300" multiple >
                            {{planEdit && formData.id && uploaderImage.queue.length==0? '重新选择': "选择"}}
                        </div>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2"> &nbsp;</label>
                <div class="form-inline">
                        <div class="label-div col-sm-8 radio-inline" ng-if="planEdit">
                            <div ng-if="planEdit && uploaderImage.queue.length>0">
                                <table class="table table-bordered table-hover">
                                    <thead>
                                    <tr>
                                        <th>图片名称</th>
                                        <th>大小</th>
                                        <th>进度</th>
                                        <th>操作</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr ng-repeat="item in uploaderImage.queue">
                                        <td><span class="first-td">{{item.file.name}}</span></td>
                                        <td>{{ item.file.size/1024/1024|number:2 }} MB</td>
                                        <td>
                                            <uib-progressbar value="item.progress">{{item.progress}}%</uib-progressbar>

                                        </td>
                                        <td><i class="fa fa-trash" aria-hidden="true" style="color: red"
                                               ng-click="item.remove();removeFile($index)"></i>
                                        </td>
                                    </tr>
                                    <tr ng-if="checkImage=='E'">
                                        <td colspan="4">
                                            <span style="color:red" >{{imageMsg}}</span>
                                        </td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
						<span ng-if="!uploadSuccess && uploaderImage.queue.length>0" class="ml-10" style="position: relative;">
							<button ng-click="submitImage()" class="a-upload">上传</button>
							共{{fileNums}}张图片
						</span>
                    </div>
                    <!-- <div style="display:inline-block;inline-height:">
                        <span ng-if="checkImage=='E'">{{imageMsg}}</span>
                    </div> -->
                </div>
                <!-- 详情 -->
                <!-- <div class="checkbox-wapper" ng-show="formData.id && !planEdit">
                    <div class="checkbox-inline iw-110" ng-repeat="url in urlList" >
                        <img ng-drop= "true" ng-drag-start= "onDragStart()" ng-alt="未找到图片" ng-src="{{url}}" height="50px" weight="60px">
                    </div>
                </div> -->

                <!-- 拖拽图片 -->

                <div class="drag-box" ng-if="planEdit && formData.id && uploaderImage.queue.length==0 && images.length>0"  >

                    <ul class="draglist drag-ul pic-box">
                        <li ng-repeat="image in images" ng-drop="true" ng-drop-success="onDropComplete($index, $data,$event)">
                            <div ng-drag="true" ng-drag-data="image.url" >
                                <a title="可拖动更改顺序" ng-if="images.length>1">
                                    <img  ng-alt="未找到图片" ng-src="{{image.url}}"  ng-class="{'widthClass':image.image.height<image.image.width ,'hightClass':image.image.height>image.image.width }">
                                </a>
                                <a ng-if="images.length<=1">
                                    <img  ng-alt="未找到图片" ng-src="{{image.url}}"  ng-class="{'widthClass':image.image.height<image.image.width ,'hightClass':image.image.height>image.image.width }">
                                </a>
                            </div>
                        </li>
                    </ul>

                </div>
                <!-- 缩略图 -->
                <div class="out-box"  ng-show="formData.id && !planEdit && images.length>0">
                    <div class="pic-box" ng-class="home">
                        <ul class="gallery gallery1 draglist" style="padding-left:0px;" >
                            <li ng-repeat="image in images">
                                <a ng-click="openLightboxModal($index)">
                                    <img ng-src="{{image.thumbUrl}}" class="img-thumbnail show_img" ng-class="{'widthClass':image.image.height<image.image.width ,'hightClass':image.image.height>image.image.width }">
                                </a>
                            </li>
                        </ul>
                        <div style="clear: both;"></div>
                    </div>
                    <!-- <div ng-show="formData.id" ng-repeat="url in urlList">
                        <img ng-src="{{url}}">
                    </div> -->
                    <div  ng-show="isShow && images.length>4"  class="more">
                        <label>
                            <input type="radio" name="color" ng-click="changeShow(1)" class="hide" ng-model="home"  value="sky">
                            <img src="image/shouqi.png">
                        </label>
                    </div>
                    <div ng-show="!isShow && images.length>4" class="up">
                        <label>
                            <input type="radio" name="color" ng-model="home" class="hide"  ng-click="changeShow(0)"  value="sky1">
                            <img src="image/more.png">
                        </label>
                    </div>
                </div>
            </div>
        </section>

        <div class="text-center">
            <button type="button" class="btn btn-primary" ng-show="planEdit" ng-click="submit()">确定</button>
            <button type="button" class="btn btn-primary" ng-hide="planEdit" ng-click="edit()">修改</button>
            <a type="button" ng-click="cancle()" class="btn ims-btn">取消</a>
        </div>
    </form>

    <script type="text/ng-template" id="myModalContent.html">
        <div class="modal-header ng-cloak">
            <h5 class="modal-title">{{param.title}}</h5>
            <span class="glyphicon glyphicon-remove" aria-hidden="true" ng-click="modelCancel()"></span>
        </div>
        <div class="modal-body ng-cloak">
            <div class="input-group input-group-sm">
                <input type="text" class="form-control" placeholder="搜索" ng-keyup="search($event)"  ng-model="advKeyword">
				<span class="input-group-btn">
					<button class="btn btn-default" type="button" ng-click="search()">
						<i class="glyphicon glyphicon-search"></i>
					</button>
				</span>
            </div>
            <div class="row">
                <ul class="list-unstyled advertiserList">
                    <li ng-repeat="item in param.item" ng-click="modelOk($event,item)">
                        {{ item.name }}
                    </li>
                </ul>
            </div>
            <s-pagination conf="paginationConf"></s-pagination>
        </div>
    </script>

    <!-- 缩略图模态框 -->
    <style>
        .pic-modal .modal-dialog {
            margin: 50px auto!important;
        }
    </style>
    <script type="text/ng-template" id="lightbox.html">
        <div class="modal-body pic-modal" ng-swipe-left="Lightbox.nextImage()" ng-swipe-right="Lightbox.prevImage()">

            <a ng-if="Lightbox.images.length > 1" class="btn btn-xs left" ng-click="Lightbox.prevImage()">
                <img src="image/left.png">
            </a>
            <a ng-if="Lightbox.images.length > 1" class="btn btn-xs right" ng-click="Lightbox.nextImage()">
                <img src="image/rightDir.png">
            </a>
            <!-- navigation -->
            <div class="lightbox-nav">
                <!-- close button -->
                <button class="close" aria-hidden="true" ng-click="$dismiss()">×</button>
                <!--<a ng-href="{{Lightbox.imageUrl}}" target="_blank"
                    class="btn btn-xs btn-default" title="Open in new tab">
                  在新网页中查看
                </a>-->

            </div>

            <div class="lightbox-image-container">
                <!-- caption -->
                <div class="lightbox-image-caption">
                    <span>{{Lightbox.imageCaption}}</span>
                </div>

                <!-- image -->
                <img ng-if="!Lightbox.isVideo(Lightbox.image)"
                     lightbox-src="{{Lightbox.imageUrl}}">

                <!-- video -->
                <div ng-if="Lightbox.isVideo(Lightbox.image)"
                     class="embed-responsive embed-responsive-16by9">
                    <!-- video file embedded directly -->
                    <video ng-if="!Lightbox.isSharedVideo(Lightbox.image)"
                           lightbox-src="{{Lightbox.imageUrl}}"
                           controls
                           autoplay="true">
                    </video>

                    <!-- video embedded with an external service using
                         `ng-videosharing-embed` -->
                    <embed-video ng-if="Lightbox.isSharedVideo(Lightbox.image)"
                                 lightbox-src="{{Lightbox.imageUrl}}"
                                 ng-href="{{Lightbox.imageUrl}}"
                                 iframe-id="lightbox-video"
                                 class="embed-responsive-item">
                        <a ng-href="{{Lightbox.imageUrl}}">Watch video</a>
                    </embed-video>
                </div>
            </div>
        </div>
    </script>
</div>
